<template>
  <el-card shadow="never">
    <el-collapse v-model="active">
      <el-collapse-item v-for="(item,index) in listData" :key="index" :name="index">
        <template slot="title">
          <span>{{ '事件'+ (index + 1) }}</span>
        </template>
        <el-form :model="form" label-width="100px">
          <el-row :gutter="20">
            <el-col>
              <el-form-item label="事件发生时间:">
                <span>{{ item.eventDate }}</span>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="事件描述:">
                <span>{{ item.eventDescribe ? item.eventDescribe : '无事件描述' }}</span>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="奖惩形式:">
                <el-radio-group v-model="item.rewardOrientation">
                  <el-radio :label="1" :disabled="true">加分</el-radio>
                  <el-radio :label="2" :disabled="true">减分</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="奖惩值:">
                <span>{{ item.rewardValue }}</span>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="创建人:">{{ item.createUser }}</el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="照片数量">
                <template
                  v-if="item.savePath && item.savePath.length > 0"
                >{{ item.savePath.length }}</template>
                <template v-else>无照片</template>
              </el-form-item>
            </el-col>
            <el-col :span="20">
              <el-form-item label="责任追加:">
                <el-button
                  v-if="item.evalEventExtradutyList && item.evalEventExtradutyList.length > 0"
                  type="text"
                  @click="$emit('showModal', item.evalEventExtradutyList)"
                >是</el-button>
                <span v-else>否</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
    </el-collapse>
    <preview-modal ref="previewModal" />
  </el-card>
</template>

<script>
import { openNotification } from '@/utils/util'
import { eventDelete } from '@/api/eval'
import PreviewModal from '@/components/PreviewModal'

export default {
  components: {
    PreviewModal
  },
  data() {
    return {
      active: ['1'],
      form: {},
      listData: []
    }
  },
  methods: {
    handlePreview(item) {
      this.$refs.previewModal.show([item])
    }
  }
}
</script>

<style scoped>
.el-form-item {
  margin-bottom: 10px;
}
</style>